<template>
    <div class="common-layout" style="width: 100%; height: 1000px;">
        <el-container>
            <div
                style="border: 1px solid; background-color: white;color: aqua; width: 100%; height: 180px; padding:20px; margin-top:20px ;">
                <el-button type="primary" @click="OpenUpdateway()"
                    style="float: right;margin-left: 15px;">修改基本信息</el-button>
                <el-button type="primary" @click="GetQRcode()" style="float: right;">溯源码</el-button>
                <!-- 溯源码 -->


                <!-- {{ BreedData }}{{ GoodsModelData }} -->
                <el-form :model="GoodsModelData" label-width="auto" style="width: 1000px;margin: 20px;">
                    <el-form-item label="封面" style="float: left;">
                        <img :src="GoodsModelData.Covers" style="margin: 10px; width: 80px; height: 90px;">
                    </el-form-item>
                    <table style="margin-left: 50px;">
                        <tbody>
                            <tr>
                                <td><el-form-item label="产品名称" style="float: right;">
                                        <span>{{ GoodsModelData.GoodsName }}</span>
                                    </el-form-item>
                                </td>
                                <td> <el-form-item label="生产许可证号" style="float: right;">
                                        <span>{{ GoodsModelData.CreateCode }}</span>
                                    </el-form-item> </td>
                            </tr>
                            <tr>
                                <td> <el-form-item label="生产批次" style="float: right;">
                                        <span>{{ GoodsModelData.CreateBatch }}</span>
                                    </el-form-item> </td>
                                <td> <el-form-item label="保质期" style="float: right;">
                                        <span>{{ GoodsModelData.ExpireTime }}</span>
                                    </el-form-item> </td>
                            </tr>
                            <tr>
                                <td> <el-form-item label="生产公司" style="float: right;">
                                        <span>{{ GoodsModelData.CreateCompany }}</span>
                                    </el-form-item> </td>
                                <td><el-form-item label="检验报告" style="float: right;">
                                        <img :src="GoodsModelData.Tests" style="width: 50px; height: 50px;">
                                    </el-form-item>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <br>
                    <hr>
                    <!-- 编辑 -->
                    <el-dialog v-model="OpenGoodsUpdate" title="基本信息编辑" width="500">
                        <!--   先整单图吧-->
                        {{ GoodsModelData }}
                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="GoodsModelData" :rules="rules"
                            label-width="auto">
                            <el-form-item label="商品名称" prop="region">
                                <el-select v-model="GoodsModelData.GoodsName" placeholder="请输入商品名称">
                                    <el-option label="兔头(麻辣)" value="兔头(麻辣)" />
                                    <el-option label="兔头(酸辣)" value="兔头(酸辣)" />
                                    <el-option label="兔肉丝" value="兔肉丝" />
                                    <el-option label="兔肉丁" value="兔肉丁" />
                                </el-select>
                            </el-form-item>
                            <el-form-item label="生产批次" prop="CreateBatch">
                                <el-input v-model="GoodsModelData.CreateBatch" disabled:true />
                            </el-form-item>
                            <el-form-item label="保质期" prop="ExpireTime">
                                <el-input v-model="GoodsModelData.ExpireTime" />
                            </el-form-item>
                            <el-form-item label="生产许可证号" prop="CreateCode">
                                <el-input v-model="GoodsModelData.CreateCode" disabled:true />
                            </el-form-item>
                            <el-form-item label="生产企业" prop="CreateCompany">
                                <el-input v-model="GoodsModelData.CreateCompany" />
                            </el-form-item>
                            <el-form-item label="封面" prop="Covers">
                                <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                    :show-file-list="false" :on-success="handleAvatarSuccess"
                                    :before-upload="beforeAvatarUpload">
                                    <img v-if="GoodsModelData.Covers" :src="GoodsModelData.Covers" class="avatar" />
                                    <el-icon v-else class="avatar-uploader-icon">
                                        <Plus />
                                    </el-icon>
                                </el-upload>
                            </el-form-item>
                            <el-form-item label="检验报告" prop="Tests">
                                <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                    :show-file-list="false" :on-success="TestImg" :before-upload="beforeAvatarUpload">
                                    <img v-if="GoodsModelData.Tests" :src="GoodsModelData.Tests" class="avatar" />
                                    <el-icon v-else class="avatar-uploader-icon">
                                        <Plus />
                                    </el-icon>
                                </el-upload>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="Updateway()">
                                    保存
                                </el-button>
                                <el-button @click="resetForm(ruleFormRef)">重置</el-button>
                            </el-form-item>
                        </el-form>
                    </el-dialog>
                </el-form>
            </div>
        </el-container>
        <div
            style="border: 1px solid; background-color: white;color: aqua; width: 100%; width: 900xp; margin: 8px; padding: 5px;">
            <el-tabs type="border-card" class="demo-tabs">
                <el-tab-pane label="养殖信息(5/5)">
                    <div>
                        <span style="float: left;">养殖信息</span>
                        <el-button type="primary" @click="openBreed = true"
                            style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                        <hr>
                        <!-- 反填养殖信息 -->
                        <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                            <tbody>
                                <tr>
                                    <td>品种:</td>
                                    <td>{{ BreedData.Kind }}</td>

                                    <td> 来源:</td>
                                    <td>{{ BreedData.From }}</td>
                                </tr>
                                <tr>
                                    <td>饲养天数:</td>
                                    <td>{{ BreedData.TakeTime }}</td>

                                    <td> 饲料品牌</td>
                                    <td>{{ BreedData.FoodBrand }}</td>
                                </tr>
                                <tr>
                                    <td>饲养负责人:</td>
                                    <td>{{ BreedData.BreedPeople }}</td>

                                    <td>出栏日期</td>
                                    <td>{{ moment(BreedData.UseTime).format("yyyy年mm月DD日") }}</td>
                                </tr>
                            </tbody>
                        </table>
                        <!-- 养殖信息编辑 -->
                        <el-dialog v-model="openBreed" title="养殖信息" width="500">
                            <!--   先整单图吧-->
                            {{ BreedData }}
                            <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                                label-width="auto">
                                <el-form-item label="品种" prop="Kind">
                                    <el-input v-model="BreedData.Kind" />
                                </el-form-item>
                                <el-form-item label="来源" prop="From">
                                    <el-input v-model="BreedData.From" />
                                </el-form-item>
                                <el-form-item label="饲养天数" prop="TakeTime">
                                    <el-input v-model="BreedData.TakeTime" />
                                </el-form-item>
                                <el-form-item label="饲料品牌" prop="FoodBrand">
                                    <el-input v-model="BreedData.FoodBrand" />
                                </el-form-item>
                                <el-form-item label="饲养负责人" prop="BreedPeople">
                                    <el-input v-model="BreedData.BreedPeople" />
                                </el-form-item>
                                <el-form-item label="出栏日期" prop="UseTime">
                                    <el-date-picker v-model="BreedData.UseTime" value-format="YYYY-MM-DD"
                                        type="datetime" placeholder="请设置出栏日期" />
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="UpdateBreedway()">
                                        保存
                                    </el-button>

                                </el-form-item>
                            </el-form>
                        </el-dialog>
                        <!-- 疫苗接种信息 -->
                        <br>
                        <hr>
                        <span style="float: left;">疫苗接种信息</span>
                        <el-button type="primary" @click="NewVaccination()"
                            style="float: left;margin: 10px;padding: 5px">新增一行</el-button>
                        <el-button @click="VaccinationKeep()" style="margin-left: 20px;" type="success">保存</el-button>
                        <!-- {{ BreedData.Vaccinations }} { BreedData.Vaccination }} -->
                        <el-table :data="BreedData.Vaccinations" style="width: 100%">
                            <el-table-column type="index" prop="date" label="序号" width="80" />
                            <el-table-column prop="Days" label="饲养天数" width="120">
                                <template v-slot="scoped">
                                    <el-input v-model="scoped.row.Days" />
                                </template>
                            </el-table-column>
                            <el-table-column prop="How" label="保健方式" width="120">
                                <template v-slot="scoped">
                                    <el-input v-model="scoped.row.How" />
                                </template>
                            </el-table-column>
                            <el-table-column prop="Way" label="保健方法" width="120">
                                <template v-slot="scoped">
                                    <el-input v-model="scoped.row.Way" />
                                </template>
                            </el-table-column>
                            <el-table-column fixed="right" label="操作" min-width="120">
                                <template v-slot="scoped">
                                    <el-button link type="primary" size="small"
                                        @click="VaccinationRemove(scoped.$index)">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>


                        <span style="float: left;">动检证</span>
                        <br>
                        <hr>
                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                            label-width="auto">
                            <el-form-item label="" prop="Kind">
                                <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                    :show-file-list="false" :on-success="CertificateImg"
                                    :before-upload="beforeAvatarUpload">
                                    <img v-if="BreedData.CertificateImg" :src="BreedData.CertificateImg"
                                        class="avatar" />
                                    <el-icon v-else class="avatar-uploader-icon">
                                        <Plus />
                                    </el-icon>
                                </el-upload>
                            </el-form-item>
                        </el-form>
                        <!-- 公司信息待修改 -->
                        <span style="float: left;">公司信息</span>
                        <el-button type="primary" @click="openCompany = true"
                            style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                        <hr>
                        <!-- 反填公司信息 -->
                        <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                            <tbody>
                                <tr>
                                    <td>养殖场:</td>
                                    <td>{{ BreedData.Farm }}</td>

                                    <td>负责人:</td>
                                    <td>{{ BreedData.Farmer }}</td>
                                </tr>
                                <tr>
                                    <td>存栏数量:</td>
                                    <td>{{ BreedData.Number }}</td>
                                </tr>
                            </tbody>
                        </table>
                        <!-- 公司信息编辑对话框 -->
                        <el-dialog v-model="openCompany" title="公司信息" width="500">
                            <!--   先整单图吧-->
                            {{ BreedData }}
                            <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                                label-width="auto">
                                <el-form-item label="养殖场" prop="Farm">
                                    <el-input v-model="BreedData.Farm" />
                                </el-form-item>
                                <el-form-item label="负责人" prop="Farmer">
                                    <el-input v-model="BreedData.Farmer" />
                                </el-form-item>
                                <el-form-item label="存栏数量" prop="Number">
                                    <el-input v-model="BreedData.Number" />
                                </el-form-item>

                                <el-form-item>
                                    <el-button type="primary" @click="UpdateBreedway()">
                                        保存
                                    </el-button>

                                </el-form-item>
                            </el-form>
                        </el-dialog>
                        <span style="float: left;">企业照片</span>
                        <br>
                        <hr>

                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                            label-width="auto">
                            <el-form-item label="" prop="Kind">
                                <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                    :show-file-list="false" :on-success="CompanyImg"
                                    :before-upload="beforeAvatarUpload">
                                    <img v-if="BreedData.CompanyImg" :src="BreedData.CompanyImg" class="avatar" />
                                    <el-icon v-else class="avatar-uploader-icon">
                                        <Plus />
                                    </el-icon>
                                </el-upload>
                            </el-form-item>
                        </el-form>
                    </div>

                    <!-- 屠宰部分 -->
                </el-tab-pane>
                <el-tab-pane label="屠宰信息">
                    <span style="float: left;">屠宰信息</span>
                    <el-button type="primary" @click="openKill = true"
                        style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                    <hr>
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                        <tbody>
                            <tr>
                                <td>批次:</td>
                                <td>{{ GoodsModelData.CreateBatch }}</td>
                                <td>到场均重:</td>
                                <td>{{ KillData.AverageWeight }}</td>
                            </tr>
                            <tr>
                                <td>到场时间:</td>
                                <td>{{ moment(KillData.ArrivalTime).format("yyyy年mm月DD日 hh:mm:ss") }}</td>
                                <td>屠宰时间:</td>
                                <td>{{ moment(KillData.KillTime).format("yyyy年mm月DD日 hh:mm:ss") }}</td>
                            </tr>
                        </tbody>
                    </table>
                    <!-- {{ KillData }} -->
                    <span style="float: left;">相关资质</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="KillData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="Test">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="Test" :before-upload="beforeAvatarUpload">
                                <img v-if="KillData.Test" :src="KillData.Test" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>
                    <!-- 屠宰信息编辑对话框 -->
                    <el-dialog v-model="openKill" title="屠宰信息" width="500">
                        <!--   先整单图吧-->
                        {{ KillData }}
                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="KillData" :rules="rules"
                            label-width="auto">
                            <el-form-item label="批次" prop="CreateBatch">
                                <el-input v-model="KillData.CreateBatch" />
                            </el-form-item>
                            <el-form-item label="到场均重" prop="AverageWeight">
                                <el-input v-model="KillData.AverageWeight" />
                            </el-form-item>
                            <el-form-item label="到场时间" prop="ArrivalTime">
                                <el-date-picker v-model="KillData.ArrivalTime" value-format="YYYY-MM-DD" type="datetime"
                                    placeholder="请设置到场时间" />

                            </el-form-item>
                            <el-form-item label="屠宰时间" prop="KillTime">
                                <el-date-picker v-model="KillData.KillTime" value-format="YYYY-MM-DD" type="datetime"
                                    placeholder="请设置屠宰时间" />
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="KillUpdateway()">
                                    保存
                                </el-button>

                            </el-form-item>
                        </el-form>
                    </el-dialog>
                    <span style="float: left;">企业信息</span>
                    <el-button type="primary" @click="openCompanyss = true"
                        style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                    <hr>
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                        <tbody>
                            <tr>
                                <td>公司名称:</td>
                                <td>{{ BreedData.Farm }}</td>
                                <td>成立时间:</td>
                                <td>
                                    {{ moment(KillData.SetUpTime).format("yyyy年mm月DD日") }}
                                </td>
                            </tr>
                            <tr>
                                <td>公司地址:</td>
                                <td>{{ KillData.CompanyAddr }}</td>
                            </tr>
                            <tr>
                                <td>公司简介:</td>
                                <td>{{ KillData.CompanyDesc }}</td>
                            </tr>
                        </tbody>
                    </table>

                    <!-- 企业信息编辑对话框 -->
                    <el-dialog v-model="openCompanyss" title="屠宰信息" width="500">
                        <!--   先整单图吧-->
                        {{ KillData }}
                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="KillData" :rules="rules"
                            label-width="auto">
                            <el-form-item label="公司名称" prop="Farm">
                                <el-input v-model="BreedData.Farm" />
                            </el-form-item>
                            <el-form-item label="成立时间" prop="SetUpTime">
                                <el-date-picker v-model="KillData.SetUpTime" value-format="YYYY-MM-DD" type="datetime"
                                    placeholder="请设置成立时间" />

                            </el-form-item>
                            <el-form-item label="公司地址" prop="CompanyAddr">
                                <el-input v-model="KillData.CompanyAddr" />
                            </el-form-item>
                            <el-form-item label="公司简介" prop="CompanyDesc">

                                <el-input v-model="KillData.CompanyDesc" style="width: 240px" :rows="2" type="textarea"
                                    placeholder="请输入公司简介" />
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="CompanyUpdateway()">
                                    保存
                                </el-button>

                            </el-form-item>
                        </el-form>
                    </el-dialog>

                    <span style="float: left;">企业照片</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="Companyss" :before-upload="beforeAvatarUpload">
                                <img v-if="KillData.About" :src="KillData.About" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>
                </el-tab-pane>
                <!-- 深加工部分 -->
                <el-tab-pane label="深加工信息">



                    <span style="float: left;">深加工信息</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                    <hr>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                        <tbody>
                            <tr>
                                <td>班组:</td>
                                <td>{{ FinishStepInfo.Group }}</td>
                            </tr>
                            <tr>
                                <td>负责人:</td>
                                <td>{{ FinishStepInfo.Curator }}</td>
                            </tr>
                        </tbody>
                    </table>

                    <span style="float: left;">食品安全信息</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="SafetyImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.SafetyImg" :src="FinishStepInfo.SafetyImg" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>


                    <span style="float: left;">供应商信息</span>
                    <br>
                    <hr>
                    <span style="float: left ; font-size: 30px;">原料|</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="margin: 10px;padding: 5px">设置</el-button>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;margin: 10px;">
                        <tbody>
                            <tr>
                                <td>生产批次:</td>
                                <td>{{ FinishStepInfo.CreateBatch }}</td>
                            </tr>

                        </tbody>
                    </table>


                    <span style="float: left;">相关材料</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="SourceImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.SourceImg" :src="FinishStepInfo.SourceImg" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>

                    <br>
                    <span style="float: left ; font-size: 30px;">辅料|</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="margin: 10px;padding: 5px">设置</el-button>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;margin: 10px;">
                        <tbody>
                            <tr>
                                <td>生产批次:</td>
                                <td>{{ FinishStepInfo.CreateBatch }}</td>
                            </tr>

                        </tbody>
                    </table>


                    <span style="float: left;">相关材料</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="OtherImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.OtherImg" :src="FinishStepInfo.OtherImg" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>




                    <br>
                    <span style="float: left ; font-size: 30px;">添加剂|</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="margin: 10px;padding: 5px">设置</el-button>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;margin: 10px;">
                        <tbody>
                            <tr>
                                <td>生产批次:</td>
                                <td>{{ FinishStepInfo.CreateBatch }}</td>
                            </tr>

                        </tbody>
                    </table>


                    <span style="float: left;">相关材料</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="AdditiveImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.AdditiveImg" :src="FinishStepInfo.AdditiveImg"
                                    class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>

                    <br>
                    <span style="float: left ; font-size: 30px;">包材|</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="margin: 10px;padding: 5px">设置</el-button>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;margin: 10px;">
                        <tbody>
                            <tr>
                                <td>生产批次:</td>
                                <td>{{ FinishStepInfo.CreateBatch }}</td>
                            </tr>

                        </tbody>
                    </table>


                    <span style="float: left;">相关材料</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="PackageImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.PackageImg" :src="FinishStepInfo.PackageImg" class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>


                    <span style="float: left;">企业信息</span>
                    <el-button type="primary" @click="openFineshStep = true"
                        style="float: left;margin: 10px;padding: 5px">设置</el-button><br>
                    <hr>
                    <!-- {{ FinishStepInfo }} -->
                    <!-- 反填屠宰信息 -->
                    <table style="font-size: 15px; font-weight: 600;padding: 10px;">
                        <tbody>
                            <tr>
                                <td>公司名称:</td>
                                <td>{{ FinishStepInfo.CompanyName }}</td>
                                <td>生产许可证号:</td>
                                <td>{{ FinishStepInfo.CreateCode }}</td>
                            </tr>

                        </tbody>
                    </table>

                    <span style="float: left;">企业照片</span>
                    <br>
                    <hr>
                    <el-form ref="ruleFormRef" style="max-width: 600px" :model="BreedData" :rules="rules"
                        label-width="auto">
                        <el-form-item label="" prop="About ">
                            <el-upload class="avatar-uploader" action="http://localhost:5048/api/Uploads/Loadway"
                                :show-file-list="false" :on-success="IndustryImg" :before-upload="beforeAvatarUpload">
                                <img v-if="FinishStepInfo.IndustryImg" :src="FinishStepInfo.IndustryImg"
                                    class="avatar" />
                                <el-icon v-else class="avatar-uploader-icon">
                                    <Plus />
                                </el-icon>
                            </el-upload>
                        </el-form-item>
                    </el-form>

                    <!-- 深加工信息编辑对话框 -->
                    <el-dialog v-model="openFineshStep" title="深加工信息" width="500">
                        <!--   先整单图吧-->
                        {{ FinishStepInfo }}
                        <el-form ref="ruleFormRef" style="max-width: 600px" :model="FinishStepInfo" :rules="rules"
                            label-width="auto">
                            <el-form-item label="班组" prop="Group">
                                <el-input v-model="FinishStepInfo.Group" />
                            </el-form-item>
                            <el-form-item label="负责人" prop="Curator">
                                <el-input v-model="FinishStepInfo.Curator" />
                            </el-form-item>
                            <el-form-item label="生产批次" prop="CreateBatch">
                                <el-input v-model="FinishStepInfo.CreateBatch" />
                            </el-form-item>
                            <el-form-item label="生产许可证号" prop="CreateCode">
                                <el-input v-model="FinishStepInfo.CreateCode" />
                            </el-form-item>
                            <el-form-item label="公司名称" prop="CompanyDesc">
                                <el-input v-model="FinishStepInfo.CompanyName" placeholder="请输入公司名称" />
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="UpdateFinishStep()">
                                    保存
                                </el-button>

                            </el-form-item>
                        </el-form>
                    </el-dialog>





                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>
<script lang="ts" setup>
import { onMounted, reactive, ref } from 'vue'
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
import axios from 'axios'
import { useRoute, useRouter } from 'vue-router'
import { Plus } from '@element-plus/icons-vue'
import type { UploadProps } from 'element-plus'
import { fa, id } from 'element-plus/es/locales.mjs';
import { assert } from '@vue/compiler-core';
//标签跳转页面 
import { Calendar } from '@element-plus/icons-vue'
import moment from 'moment'
const router = useRouter();
const route = useRoute();
onMounted(() => {
    GetGoodsModel();
})
//商品部分
//#region 

const ruleFormRef = ref<FormInstance>()
//详情数据
//#region    
const GoodsModelData = reactive({
    "Id": route.query.Id,
    "GoodsName": "",
    "CreateBatch": "",
    "ExpireTime": null,
    "CreateCode": "",
    "CreateCompany": "",
    "Covers": "",
    "Tests": "",
    Proportion:"0%",
    BreedId: null,
    KillId: null,
    FinishStepId: null
})
//获取详情数据
const GetGoodsModel = () => {
    axios.get("/api/Goods/GoodsModel", {
        params: {
            Id: GoodsModelData.Id
        }
    }).then(res => {
        Object.assign(GoodsModelData, res.data.Data);  //快速赋值
        // GoodsModelData.GoodsName = res.data.Data.GoodsName
        // GoodsModelData.CreateBatch = res.data.Data.CreateBatch
        // GoodsModelData.ExpireTime = res.data.Data.ExpireTime
        // GoodsModelData.CreateCode = res.data.Data.CreateCode
        // GoodsModelData.CreateCompany = res.data.Data.CreateCompany
        // GoodsModelData.Covers = res.data.Data.Covers
        // GoodsModelData.Tests = res.data.Data.Tests
        GetBreed();
        GetKill();
        GetFinishStep();
    })
}
//#endregion
//商品编辑
//#region 

//封面图片上传
const handleAvatarSuccess = (
    ImgPath: any
) => {
    GoodsModelData.Covers = ImgPath
    //ElMessage.success(GoodsAddData.Covers);
}
//检验图片上传
const TestImg = (
    ImgPath: any
) => {
    GoodsModelData.Tests = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//验证图片格式大小
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
    if (rawFile.type !== 'image/jpeg' && rawFile.type !== 'image/jpg' && rawFile.type !== 'image/gif' && rawFile.type !== 'image/png') {
        ElMessage.error('图片格式不正确!')
        return false
    } else if (rawFile.size / 1024 / 1024 > 2) {
        ElMessage.error('图片大小不能超过2MB!')
        return false
    }
    return true
}
//商品编辑
const OpenGoodsUpdate = ref(false)
const Id = ref(0)
const OpenUpdateway = () => {
    OpenGoodsUpdate.value = true;
}
//校验
const rules = reactive<FormRules>({
    GoodsName: [
        { required: true, message: '请输入商品名称', trigger: 'blur' },
    ],
    ExpireTime: [
        { required: true, message: '请输入过期时间', trigger: 'blur' },
    ],
    CreateCompany: [
        { required: true, message: '请输入生产企业', trigger: 'blur' },
    ],
    Covers: [
        { required: true, message: '请选择商品封面', trigger: 'blur' },
    ],

    Tests: [
        { required: true, message: '请选择商品检验表单', trigger: 'blur' },
    ],
    CreateBatch: [
        { required: true, message: '请输入生产批次', trigger: 'blur' },
    ],
    CreateCode: [
        { required: true, message: '请输入生产许可证号', trigger: 'blur' },
    ],
})
//修改
const Updateway = () => {
    axios.put("/api/Goods/GoodsUpdate", {
        "Id": GoodsModelData.Id,
        "GoodsName": GoodsModelData.GoodsName,
        "CreateBatch": GoodsModelData.CreateBatch,
        "ExpireTime": GoodsModelData.ExpireTime,
        "CreateCode": GoodsModelData.CreateCode,
        "CreateCompany": GoodsModelData.CreateCompany,
        "Covers": GoodsModelData.Covers,
        "Tests": GoodsModelData.Tests
    }).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success(res.data.Message);
            OpenGoodsUpdate.value = false;
            GetGoodsModel();
        }
        else {
            ElMessage.error(res.data.Message);
        }
    })
}
//重置
const resetForm = (formEl: FormInstance | undefined) => {
    if (!formEl) return
    formEl.resetFields()
}
//#endregion
// 养殖信息反填
//#region   
//养殖信息变量
const BreedData = reactive({
    "Id": null,
    "Kind": "",
    "From": "",
    "TakeTime": null,
    "FoodBrand": "",
    "BreedPeople": "string",
    "UseTime": "",
    "Vaccination": "",
    "CertificateImg": "",
    "Farm": "",
    "Farmer": "",
    "Number": null,
    "CompanyImg": "",
    Vaccinations: <any>[] //存放疫苗接种数据

})

const GetBreed = () => {
    axios.get("/api/Breed/BreedGet", {
        params: {
            BreedId: GoodsModelData.BreedId
        }
    }).then(res => {
        // alert(GoodsModelData.BreedId)
        console.log(res.data);
        Object.assign(BreedData, res.data.Data)
        BreedData.Vaccinations = JSON.parse(BreedData.Vaccination);  //反序列化 用于显示疫苗接种情况
    })
}
//#endregion
//#endregion
//编辑养殖信息
//#region 
const openBreed = ref(false);
const UpdateBreedway = () => {
    axios.put("/api/Breed/BreedUpdate", BreedData).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success(res.data.Message);
            openBreed.value = false;
            GetGoodsModel();
        }
        else {
            ElMessage.error(res.data.Message);
        }
    })
}
//#endregion
//编辑疫苗信息
//#region 


//新增一行
const NewVaccination = () => {
    BreedData.Vaccinations.push({ Days: null, How: "", Way: "" })
}

//删除一行
const VaccinationRemove = (index: any) => {
    console.log(index);

    BreedData.Vaccinations.splice(index, 1)
}
//保存编辑疫苗信息
const VaccinationKeep = () => {
    BreedData.Vaccination = JSON.stringify(BreedData.Vaccinations);
    axios.put("/api/Breed/BreedUpdate", BreedData).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success("疫苗信息修改成功");
            openBreed.value = false;
            GetGoodsModel();
        }
        else {
            ElMessage.error("疫苗信息修改失败");
        }
    })
}
//动检证

//检验图片上传
const CertificateImg = (
    ImgPath: any
) => {
    BreedData.CertificateImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}

const openCompany = ref(false);
//公司照片
const CompanyImg = (
    ImgPath: any
) => {
    BreedData.CompanyImg = ImgPath
}
//#endregion
// 屠宰信息
//#region 
//屠宰反填
//#region 
//屠宰数据变量
const KillData = reactive({
    "Id": null,
    "CreateBatch": GoodsModelData.CreateBatch,
    "AverageWeight": null,
    "ArrivalTime": "",
    "KillTime": "",
    "Test": "",
    "CompanyAddr": "",
    "SetUpTime": "",
    "CompanyDesc": "",
    "About": ""
})
const GetKill = () => {
    axios.get("/api/Kills/KillGet", {
        params: {
            KillId: GoodsModelData.KillId
        }
    }).then(res => {
        //alert(GoodsModelData.KillId)
        Object.assign(KillData, res.data.Data);
    })
}

//相关资质
//检验图片上传
const Test = (
    ImgPath: any
) => {
    KillData.Test = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//#endregion
//屠宰编辑
//#region 
const openKill = ref(false);
const KillUpdateway = () => {
    axios.put("/api/Kills/KillUpdate", KillData).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success(res.data.Message);
            openKill.value = false;
            GetKill();
        }
        else {
            ElMessage.error(res.data.Message);
        }
    })
}
//#endregion
//打开公司编辑对话框
const openCompanyss = ref(false);
const CompanyUpdateway = () => {
    axios.put("/api/Kills/KillUpdate", KillData).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success("公司信息编辑成功");
            openCompanyss.value = false;
            GetKill();
        }
        else {
            ElMessage.error("公司信息编辑失败");
        }
    })
}
//公司照片
const Companyss = (
    ImgPath: any
) => {
    KillData.About = ImgPath
}
//#endregion
//深加工信息
//#region 
//深加工变量
const FinishStepInfo = reactive({
    "Id": GoodsModelData.FinishStepId,
    "Group": "",
    "Curator": "",
    "CreateBatch": "",
    "CreateCode": "",
    "SafetyImg": "",
    "SourceImg": "",
    "OtherImg": "",
    "AdditiveImg": "",
    "PackageImg": "",
    "CompanyName": "",
    "IndustryImg": ""
})
const GetFinishStep = () => {
    axios.get("/api/FinishStep/FinishStepGet", {
        params: {
            Id: GoodsModelData.FinishStepId
        }
    }).then(res => {
        console.log(res.data);
        Object.assign(FinishStepInfo, res.data.Data)  //获取深加工数据

    })
}
//食品安全信息图片

const SafetyImg = (
    ImgPath: any
) => {
    FinishStepInfo.SafetyImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//供应商上传  原料
const SourceImg = (
    ImgPath: any
) => {
    FinishStepInfo.SourceImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//供应商上传  辅料AdditiveImg
const OtherImg = (
    ImgPath: any
) => {
    FinishStepInfo.OtherImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//供应商上传  添加剂 PackageImg
const AdditiveImg = (
    ImgPath: any
) => {
    FinishStepInfo.AdditiveImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//供应商上传  包材 IndustryImg
const PackageImg = (
    ImgPath: any
) => {
    FinishStepInfo.PackageImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}
//企业照片 IndustryImg
const IndustryImg = (
    ImgPath: any
) => {
    FinishStepInfo.IndustryImg = ImgPath
    // ElMessage.success(GoodsAddData.Tests);
}

const openFineshStep = ref(false);
const UpdateFinishStep = () => {
    axios.put("/api/FinishStep/FinishStepUpdate", FinishStepInfo).then(res => {
        console.log(res.data);
        if (res.data.Num == 200) {
            ElMessage.success(res.data.Message);
            openFineshStep.value = false;
            GetKill();
        }
        else {
            ElMessage.error(res.data.Message);
        }
    })
}
//#endregion
//溯源码
const GetQRcode =()=>{
    //页面跳转
    router.push("/Demo")
    localStorage.setItem("Name",GoodsModelData.GoodsName)  //商品名称
    localStorage.setItem("Company",GoodsModelData.CreateCompany)  //公司名称
    localStorage.setItem("CreateBatch",GoodsModelData.CreateBatch)  //生产批次
    localStorage.setItem("CreateCode",GoodsModelData.CreateCode)  //生产许可证号
    
}






</script>



<style scoped>
.avatar-uploader .avatar {
    width: 100px;
    height: 100px;
    display: block;
}
</style>
<style>
.avatar-uploader .el-upload {
    border: 1px dashed var(--el-border-color);
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
    border-color: var(--el-color-primary);
}

.el-icon.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 100px;
    height: 100px;
    text-align: center;
}
</style>
<style>
.demo-tabs>.el-tabs__content {
    padding: 32px;
    color: #6b778c;
    font-size: 32px;
    font-weight: 600;
}

.demo-tabs .custom-tabs-label .el-icon {
    vertical-align: middle;
}

.demo-tabs .custom-tabs-label span {
    vertical-align: middle;
    margin-left: 4px;
}
</style>
